<template>
	<view class="container">
		<u--form labelPosition="left" :model="from" :rules="rules" ref="uForm" labelWidth="90">
			<u-form-item label="客户名称" prop="nickname" borderBottom ref="item1">
				<u--input v-model="from.nickname" border="none"></u--input>
			</u-form-item>
			<u-form-item label="邮箱" prop="email" borderBottom ref="item1">
				<u--input v-model="from.email" border="none"></u--input>
			</u-form-item>
			<u-form-item label="手机号" prop="mobile" borderBottom ref="item1">
				<u--input v-model="from.mobile" border="none"></u--input>
			</u-form-item>
			<u-form-item label="性别" prop="gender" borderBottom ref="item1">
				<u-radio-group v-model="from.gender" placement="row">
					<u-radio :customStyle="{marginLeft: '20px'}" v-for="(item, index) in sexActions" :key="index"
						:label="item.name" :name="item.value">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item label="认证状态" prop="auth" borderBottom @click="showAuth = true;" ref="item1">
				<u-radio-group v-model="from.auth" placement="row">
					<u-radio :customStyle="{marginLeft: '20px'}" v-for="(item, index) in authActions" :key="index"
						:label="item.name" :name="item.value">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item label="金额" prop="money" borderBottom ref="item1">
				<u--input v-model="from.money" border="none"></u--input>
			</u-form-item>
			<u-form-item label="客户来源" borderBottom @click="showSourceid = true;" ref="item1">
				<u--input v-model="from.sourceName" disabled disabledColor="#ffffff" placeholder="请选择性别"
					border="none"></u--input>
				<u-icon slot="right" name="arrow-right"></u-icon>
			</u-form-item>
			<u-form-item label="成交状态" prop="deal" borderBottom @click="showDeal = true;" ref="item1">
				<u-radio-group v-model="from.deal" placement="row">
					<u-radio :customStyle="{marginLeft: '20px'}" v-for="(item, index) in dealActions" :key="index"
						:label="item.name" :name="item.value">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item label="地址">
				<pick-regions :defaultRegion="from.region" @getRegion="handleGetRegion">
					<u--input v-model="from.address" disabled disabledColor="#ffffff" placeholder="请选择地区"
						suffixIcon="arrow-down">
					</u--input>
				</pick-regions>
			</u-form-item>
		</u--form>
		<u-action-sheet :show="showSourceid" :actions="sourceidActions" title="请选择来源" @close="showSourceid = false"
			@select="sourceidSelect">
		</u-action-sheet>
		<u-button type="success" @click="submit" color="#19BC9C" :customStyle="btnStyle">提交</u-button>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				showSourceid: false,
				from: {
					nickname: '',
					email: '',
					mobile: '',
					gender: '0',
					auth: '0',
					money: '',
					sourceName: '',
					sourceid: '',
					deal: '0',
					address: '',
					region: ''
				},
				sexActions: [{
						name: '保密',
						value: '0'
					},
					{
						name: '男',
						value: '1'
					},
					{
						name: '女',
						value: '2'
					}

				],
				authActions: [{
						name: '未认证',
						value: '0'
					},
					{
						name: '已认证',
						value: '1'
					},
				],
				sourceidActions: [],
				dealActions: [{
						name: '未成交',
						value: '0'
					},
					{
						name: '已成交',
						value: '1'
					}
				],
				rules: {
					'nickname': {
						type: 'string',
						required: true,
						message: '请填写客户名称',
						trigger: ['blur', 'change']
					},
					'gender': {
						type: 'string',
						required: true,
						message: '请选择性别',
						trigger: ['blur', 'change']
					},
					'email': {
						type: 'email',
						message: '请填写正确的邮箱',
						trigger: ['blur', 'change']
					},
					'mobile': [{
						required: true,
						message: '请填写手机号',
						// blur和change事件触发检验
						trigger: ['blur', 'change'],
					}, {
						pattern: /^1[3456789]\d{9}$/,
						// 正则检验前先将值转为字符串
						transform(value) {
							return String(value);
						},
						message: '请填写正确的手机号'
					}, ],
					'auth': {
						type: 'string',
						required: true,
						message: '请选择认证状态',
						trigger: ['blur', 'change']
					},
					'money': {
						type: 'number',
						message: '请填写数字',
						trigger: ['blur', 'change']
					},
					'deal': {
						type: 'string',
						required: true,
						message: '请选择成交状态',
						trigger: ['blur', 'change']
					}

				},
				radio: '',
				switchVal: false,
				btnStyle: {
					width: '100%',
					marginTop: '10px'
				},
				LoginUser: {}
			};
		},
		onReady() {
			this.$u.auth.check();
			this.$refs.uForm.setRules(this.rules)
			this.LoginUser = uni.getStorageSync('LoginUser') ? uni.getStorageSync('LoginUser') : {}
			this.getSource();
		},
		methods: {
			sourceidSelect(e) {
				this.from.sourceName = e.name,
					this.from.sourceid = e.id
			},
			async getSource() {
				let result = await this.$u.api.manage.sourceIndex()
				if (result.code == 1) {
					this.sourceidActions = result.data
				}
			},
			submit() {
				this.$refs.uForm.validate().then(async () => {
					this.from.adminid=this.LoginUser.id
					let result = await this.$u.api.manage.privateseaAdd(this.from)
					if (result.code == 1) {
						this.$refs.uToast.show({
							type: 'success',
							message: result.msg,
							complete: function() {
								uni.navigateTo({
									url: '/pages/manage/privatesea/index'
								});
							}
						})
					} else {
						this.$refs.uToast.show({
							type: 'error',
							message: result.msg
						})
					}
				}).catch(errors => {})
			},
			handleGetRegion(val) {
				let [province, city, district] = val
				this.from.address = province.name + "-" + city.name + "-" + district.name
				this.from.region = district.code
			},


		},
	};
</script>


<style>
	.container {
		padding: 8px;
	}

	uni-picker {
		width: 100%;

	}
</style>